// base color
$blue:#0095e3;
$light-blue:rgb(77, 147, 218);
$red:#fd0003;
$pink: #E65D6E;
$green: #15ff15;
$tiffany: #4AB7BD;
$yellow:#ffba00;
$orange: #ff7f05;
$panGreen: #30B08F;

// sidebar
$menuText: #ffffff;
$menuActiveText:#0095e3;
$subMenuActiveText:#0095e3; // https://github.com/ElemeFE/element/issues/12951

$menuBg: transparent;
$menuHover:rgba(63, 81, 181, 0.5);

$subMenuBg:transparent;
$subMenuHover: rgba(63, 81, 181, 0.3);

$sideBarWidth: 210px;
$hideSideBarWidth: 30px;
$navBarHeight: 50px;

// box-style
$boxBorder: 1px solid #5967a4;
$borderColor:#5967a4;
$boxBgc: linear-gradient(to right bottom, rgba(63,81,181,.3), rgba(63,81,181,0));
$boxShaow: 3px 3px 5px 2px rgba(11,25,56,.6);

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
  boxBorder: $boxBorder;
  boxBgc: $boxBgc;
  boxShaow: $boxShaow;
  borderColor: $borderColor;
  hideSideBarWidth: $hideSideBarWidth;
  navBarHeight: $navBarHeight;
}
